﻿@{
    ViewBag.Title = "My Loanables";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@if (User != null)
{
    <div id="PresentationBox">
        <h2 class="centeredHeaderText">My loanables</h2>

        <table class="DataPresentationtable" id="allMyTitles">
            <tr>
                <td><center><img src="/Content/images/loading.gif" />loading data...</center></td>
            </tr>
        </table>
    </div>


    <script type="text/javascript">

        var dataSet = [];

    $(document).ready(function () {
        $.ajax({
            url: "/api/loanable/?onlyMine",
            type: "GET",
            beforeSend: function (xhr) {
                xhr.setRequestHeader("Authorization", getAuthorizationHeader('@User.UserId', ''));
            },
            dataType: "json"
        }).done(function (data) {
            console.log(data);
            $.each(data, function (key, val) {
                console.log(val);

                var loanable = [];

                //title.ISBN = val.ISBN;
                loanable.Title = "<a href='/Title/Get/" + val.TitleId + "'>" + val.Title + "</a>";
                loanable.DoelibsId = val.DoelibsId;
                loanable.Status = getStatusAsString(val.LoanableStatus);
                
                if (val.Borrowed) {
                    loanable.Borrower = val.Borrower;
                    loanable.BorrowDate = val.BorrowDate.split("T").splice(0, 1);
                } else {
                    loanable.Borrower = null;
                    loanable.BorrowDate = null;
                }

                dataSet.push(loanable);
            });

            $('#allMyTitles').DataTable({
                "bFilter": false,
                "fnDrawCallback": function () {
                    if (Math.ceil((this.fnSettings().fnRecordsDisplay()) / this.fnSettings()._iDisplayLength) > 1) {
                        $('#allMyTitles_paginate').css("display", "block");
                    } else {
                        $('#allMyTitles_paginate').css("display", "none");
                    }
                },
                "data": dataSet,
                "columns": [
                    { "data": "Title", "title": "Title", "width": "45%" },
                    { "data": "DoelibsId", "title": "DoeLibS Identifier", "width": "15%" },
                    { "data": "Status", "title": "Status", "width": "10%" },
                    { "data": "Borrower", "title": "Borrower", "width": "15%" },
                    { "data": "BorrowDate", "title": "Borrow Date", "width": "15%" }
                ]
            });

            //remove ugly DataTable css
            $('#allMyTitles').removeClass("dataTable");
        });
    });
    </script>
}
